<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="点位编号" prop="mediaNo">
        <el-input
          v-model="queryParams.mediaNo"
          placeholder="请输入点位编号"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="点位名称" prop="mediaName">
        <el-input
          v-model="queryParams.mediaName"
          placeholder="请输入点位名称"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="省份" prop="mediaProvince">
        <el-input
          v-model="queryParams.mediaProvince"
          placeholder="请输入省份"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="城市" prop="mediaCity">
        <el-input
          v-model="queryParams.mediaCity"
          placeholder="请输入城市"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="区县" prop="mediaCounty">
        <el-input
          v-model="queryParams.mediaCounty"
          placeholder="请输入区县"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="点位位置" prop="mediaAddr">
        <el-input
          v-model="queryParams.mediaAddr"
          placeholder="请输入点位位置"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="媒体性质 公交:1,城市路媒:2,楼宇:3,城市轨道交通:4,高速/国道:5,其他:6" prop="mediaType">
        <el-select v-model="queryParams.mediaType" placeholder="请选择媒体性质 公交:1,城市路媒:2,楼宇:3,城市轨道交通:4,高速/国道:5,其他:6" clearable>
          <el-option
            v-for="dict in dict.type.user_media_type"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="详细地址" prop="mediaCommunityAddr">
        <el-input
          v-model="queryParams.mediaCommunityAddr"
          placeholder="请输入详细地址"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="社区级别" prop="mediaLevel">
        <el-input
          v-model="queryParams.mediaLevel"
          placeholder="请输入社区级别"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="房屋数量" prop="mediaHouseNum">
        <el-input
          v-model="queryParams.mediaHouseNum"
          placeholder="请输入房屋数量"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="人口数量" prop="mediaPersonNum">
        <el-input
          v-model="queryParams.mediaPersonNum"
          placeholder="请输入人口数量"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="入住率" prop="mediaRuzhuRate">
        <el-input
          v-model="queryParams.mediaRuzhuRate"
          placeholder="请输入入住率"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="社区受众描述" prop="mediaAudienceDetail">
        <el-input
          v-model="queryParams.mediaAudienceDetail"
          placeholder="请输入社区受众描述"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="楼层数" prop="mediaFloorNum">
        <el-input
          v-model="queryParams.mediaFloorNum"
          placeholder="请输入楼层数"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="楼栋数量" prop="mediaBuildingNum">
        <el-input
          v-model="queryParams.mediaBuildingNum"
          placeholder="请输入楼栋数量"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="电梯数量" prop="mediaLiftsNum">
        <el-input
          v-model="queryParams.mediaLiftsNum"
          placeholder="请输入电梯数量"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="行业禁忌" prop="mediaTaboo">
        <el-input
          v-model="queryParams.mediaTaboo"
          placeholder="请输入行业禁忌"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="点位类型 道闸广告:1,电梯框架:2,广告看板:3,屏蔽门:4,候车亭广告:5,车身广告:6,其他:7" prop="mediaShowType">
        <el-select v-model="queryParams.mediaShowType" placeholder="请选择点位类型 道闸广告:1,电梯框架:2,广告看板:3,屏蔽门:4,候车亭广告:5,车身广告:6,其他:7" clearable>
          <el-option
            v-for="dict in dict.type.user_media_show_type"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="点位所属 自有点位:0,租用:1,禁用:2" prop="mediaBelonging">
        <el-input
          v-model="queryParams.mediaBelonging"
          placeholder="请输入点位所属 自有点位:0,租用:1,禁用:2"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="楼栋号" prop="mediaSubBuilding">
        <el-input
          v-model="queryParams.mediaSubBuilding"
          placeholder="请输入楼栋号"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="单元号" prop="mediaSubHouse">
        <el-input
          v-model="queryParams.mediaSubHouse"
          placeholder="请输入单元号"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="电梯号" prop="mediaSubLifts">
        <el-input
          v-model="queryParams.mediaSubLifts"
          placeholder="请输入电梯号"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="尺寸" prop="mediaSize">
        <el-input
          v-model="queryParams.mediaSize"
          placeholder="请输入尺寸"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="价格" prop="mediaPrice">
        <el-input
          v-model="queryParams.mediaPrice"
          placeholder="请输入价格"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="价格时间 日:0,周:1,月:2,年:3" prop="mediaPriceTime">
        <el-input
          v-model="queryParams.mediaPriceTime"
          placeholder="请输入价格时间 日:0,周:1,月:2,年:3"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="开始时间" prop="mediaBeginTime">
        <el-date-picker clearable
          v-model="queryParams.mediaBeginTime"
          type="date"
          value-format="yyyy-MM-dd"
          placeholder="请选择开始时间">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="结束时间" prop="mediaEndTime">
        <el-date-picker clearable
          v-model="queryParams.mediaEndTime"
          type="date"
          value-format="yyyy-MM-dd"
          placeholder="请选择结束时间">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="联系人" prop="mediaContacts">
        <el-input
          v-model="queryParams.mediaContacts"
          placeholder="请输入联系人"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="电话" prop="mediaPhone">
        <el-input
          v-model="queryParams.mediaPhone"
          placeholder="请输入电话"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="经度" prop="mediaLng">
        <el-input
          v-model="queryParams.mediaLng"
          placeholder="请输入经度"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="纬度" prop="mediaLat">
        <el-input
          v-model="queryParams.mediaLat"
          placeholder="请输入纬度"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          v-hasPermi="['gate:media:add']"
        >新增</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="success"
          plain
          icon="el-icon-edit"
          size="mini"
          :disabled="single"
          @click="handleUpdate"
          v-hasPermi="['gate:media:edit']"
        >修改</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="danger"
          plain
          icon="el-icon-delete"
          size="mini"
          :disabled="multiple"
          @click="handleDelete"
          v-hasPermi="['gate:media:remove']"
        >删除</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          @click="handleExport"
          v-hasPermi="['gate:media:export']"
        >导出</el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

    <el-table v-loading="loading" :data="mediaList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="" align="center" prop="mediaId" />
      <el-table-column label="点位编号" align="center" prop="mediaNo" />
      <el-table-column label="点位名称" align="center" prop="mediaName" />
      <el-table-column label="省份" align="center" prop="mediaProvince" />
      <el-table-column label="城市" align="center" prop="mediaCity" />
      <el-table-column label="区县" align="center" prop="mediaCounty" />
      <el-table-column label="点位位置" align="center" prop="mediaAddr" />
      <el-table-column label="媒体性质 公交:1,城市路媒:2,楼宇:3,城市轨道交通:4,高速/国道:5,其他:6" align="center" prop="mediaType">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.user_media_type" :value="scope.row.mediaType"/>
        </template>
      </el-table-column>
      <el-table-column label="详细地址" align="center" prop="mediaCommunityAddr" />
      <el-table-column label="社区级别" align="center" prop="mediaLevel" />
      <el-table-column label="社区分类" align="center" prop="mediaCommunityType" />
      <el-table-column label="房屋数量" align="center" prop="mediaHouseNum" />
      <el-table-column label="人口数量" align="center" prop="mediaPersonNum" />
      <el-table-column label="入住率" align="center" prop="mediaRuzhuRate" />
      <el-table-column label="社区受众描述" align="center" prop="mediaAudienceDetail" />
      <el-table-column label="楼层数" align="center" prop="mediaFloorNum" />
      <el-table-column label="楼栋数量" align="center" prop="mediaBuildingNum" />
      <el-table-column label="电梯数量" align="center" prop="mediaLiftsNum" />
      <el-table-column label="行业禁忌" align="center" prop="mediaTaboo" />
      <el-table-column label="点位类型 道闸广告:1,电梯框架:2,广告看板:3,屏蔽门:4,候车亭广告:5,车身广告:6,其他:7" align="center" prop="mediaShowType">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.user_media_show_type" :value="scope.row.mediaShowType"/>
        </template>
      </el-table-column>
      <el-table-column label="点位所属 自有点位:0,租用:1,禁用:2" align="center" prop="mediaBelonging">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.user_media_belonging" :value="scope.row.mediaBelonging"/>
        </template>
      </el-table-column>
      <el-table-column label="楼栋号" align="center" prop="mediaSubBuilding" />
      <el-table-column label="单元号" align="center" prop="mediaSubHouse" />
      <el-table-column label="电梯号" align="center" prop="mediaSubLifts" />
      <el-table-column label="尺寸" align="center" prop="mediaSize" />
      <el-table-column label="价格" align="center" prop="mediaPrice" />
      <el-table-column label="价格时间 日:0,周:1,月:2,年:3" align="center" prop="mediaPriceTime">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.user_media_price_time" :value="scope.row.mediaPriceTime"/>
        </template>
      </el-table-column>
      <el-table-column label="点位照片" align="center" prop="mediaPhoto" />
      <el-table-column label="开始时间" align="center" prop="mediaBeginTime" width="180">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.mediaBeginTime, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column label="结束时间" align="center" prop="mediaEndTime" width="180">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.mediaEndTime, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column label="联系人" align="center" prop="mediaContacts" />
      <el-table-column label="电话" align="center" prop="mediaPhone" />
      <el-table-column label="经度" align="center" prop="mediaLng" />
      <el-table-column label="纬度" align="center" prop="mediaLat" />
      <el-table-column label="变更状态" align="center" prop="mediaChangedState" />
      <el-table-column label="图片列表" align="center" prop="mediaPicList" />
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleUpdate(scope.row)"
            v-hasPermi="['gate:media:edit']"
          >修改</el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
            v-hasPermi="['gate:media:remove']"
          >删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    
    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />

    <!-- 添加或修改媒体点位对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-form-item label="点位编号" prop="mediaNo">
          <el-input v-model="form.mediaNo" placeholder="请输入点位编号" />
        </el-form-item>
        <el-form-item label="点位名称" prop="mediaName">
          <el-input v-model="form.mediaName" placeholder="请输入点位名称" />
        </el-form-item>
        <el-form-item label="省份" prop="mediaProvince">
          <el-input v-model="form.mediaProvince" placeholder="请输入省份" />
        </el-form-item>
        <el-form-item label="城市" prop="mediaCity">
          <el-input v-model="form.mediaCity" placeholder="请输入城市" />
        </el-form-item>
        <el-form-item label="区县" prop="mediaCounty">
          <el-input v-model="form.mediaCounty" placeholder="请输入区县" />
        </el-form-item>
        <el-form-item label="点位位置" prop="mediaAddr">
          <el-input v-model="form.mediaAddr" placeholder="请输入点位位置" />
        </el-form-item>
        <el-form-item label="媒体性质 公交:1,城市路媒:2,楼宇:3,城市轨道交通:4,高速/国道:5,其他:6" prop="mediaType">
          <el-select v-model="form.mediaType" placeholder="请选择媒体性质 公交:1,城市路媒:2,楼宇:3,城市轨道交通:4,高速/国道:5,其他:6">
            <el-option
              v-for="dict in dict.type.user_media_type"
              :key="dict.value"
              :label="dict.label"
              :value="parseInt(dict.value)"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="详细地址" prop="mediaCommunityAddr">
          <el-input v-model="form.mediaCommunityAddr" placeholder="请输入详细地址" />
        </el-form-item>
        <el-form-item label="社区级别" prop="mediaLevel">
          <el-input v-model="form.mediaLevel" placeholder="请输入社区级别" />
        </el-form-item>
        <el-form-item label="房屋数量" prop="mediaHouseNum">
          <el-input v-model="form.mediaHouseNum" placeholder="请输入房屋数量" />
        </el-form-item>
        <el-form-item label="人口数量" prop="mediaPersonNum">
          <el-input v-model="form.mediaPersonNum" placeholder="请输入人口数量" />
        </el-form-item>
        <el-form-item label="入住率" prop="mediaRuzhuRate">
          <el-input v-model="form.mediaRuzhuRate" placeholder="请输入入住率" />
        </el-form-item>
        <el-form-item label="社区受众描述" prop="mediaAudienceDetail">
          <el-input v-model="form.mediaAudienceDetail" placeholder="请输入社区受众描述" />
        </el-form-item>
        <el-form-item label="楼层数" prop="mediaFloorNum">
          <el-input v-model="form.mediaFloorNum" placeholder="请输入楼层数" />
        </el-form-item>
        <el-form-item label="楼栋数量" prop="mediaBuildingNum">
          <el-input v-model="form.mediaBuildingNum" placeholder="请输入楼栋数量" />
        </el-form-item>
        <el-form-item label="电梯数量" prop="mediaLiftsNum">
          <el-input v-model="form.mediaLiftsNum" placeholder="请输入电梯数量" />
        </el-form-item>
        <el-form-item label="行业禁忌" prop="mediaTaboo">
          <el-input v-model="form.mediaTaboo" placeholder="请输入行业禁忌" />
        </el-form-item>
        <el-form-item label="点位类型 道闸广告:1,电梯框架:2,广告看板:3,屏蔽门:4,候车亭广告:5,车身广告:6,其他:7" prop="mediaShowType">
          <el-select v-model="form.mediaShowType" placeholder="请选择点位类型 道闸广告:1,电梯框架:2,广告看板:3,屏蔽门:4,候车亭广告:5,车身广告:6,其他:7">
            <el-option
              v-for="dict in dict.type.user_media_show_type"
              :key="dict.value"
              :label="dict.label"
              :value="parseInt(dict.value)"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="点位所属 自有点位:0,租用:1,禁用:2" prop="mediaBelonging">
          <el-input v-model="form.mediaBelonging" placeholder="请输入点位所属 自有点位:0,租用:1,禁用:2" />
        </el-form-item>
        <el-form-item label="楼栋号" prop="mediaSubBuilding">
          <el-input v-model="form.mediaSubBuilding" placeholder="请输入楼栋号" />
        </el-form-item>
        <el-form-item label="单元号" prop="mediaSubHouse">
          <el-input v-model="form.mediaSubHouse" placeholder="请输入单元号" />
        </el-form-item>
        <el-form-item label="电梯号" prop="mediaSubLifts">
          <el-input v-model="form.mediaSubLifts" placeholder="请输入电梯号" />
        </el-form-item>
        <el-form-item label="尺寸" prop="mediaSize">
          <el-input v-model="form.mediaSize" placeholder="请输入尺寸" />
        </el-form-item>
        <el-form-item label="价格" prop="mediaPrice">
          <el-input v-model="form.mediaPrice" placeholder="请输入价格" />
        </el-form-item>
        <el-form-item label="价格时间 日:0,周:1,月:2,年:3" prop="mediaPriceTime">
          <el-input v-model="form.mediaPriceTime" placeholder="请输入价格时间 日:0,周:1,月:2,年:3" />
        </el-form-item>
        <el-form-item label="点位照片" prop="mediaPhoto">
          <el-input v-model="form.mediaPhoto" type="textarea" placeholder="请输入内容" />
        </el-form-item>
        <el-form-item label="开始时间" prop="mediaBeginTime">
          <el-date-picker clearable
            v-model="form.mediaBeginTime"
            type="date"
            value-format="yyyy-MM-dd"
            placeholder="请选择开始时间">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="结束时间" prop="mediaEndTime">
          <el-date-picker clearable
            v-model="form.mediaEndTime"
            type="date"
            value-format="yyyy-MM-dd"
            placeholder="请选择结束时间">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="联系人" prop="mediaContacts">
          <el-input v-model="form.mediaContacts" placeholder="请输入联系人" />
        </el-form-item>
        <el-form-item label="电话" prop="mediaPhone">
          <el-input v-model="form.mediaPhone" placeholder="请输入电话" />
        </el-form-item>
        <el-form-item label="经度" prop="mediaLng">
          <el-input v-model="form.mediaLng" placeholder="请输入经度" />
        </el-form-item>
        <el-form-item label="纬度" prop="mediaLat">
          <el-input v-model="form.mediaLat" placeholder="请输入纬度" />
        </el-form-item>
        <el-form-item label="变更状态" prop="mediaChangedState">
          <el-input v-model="form.mediaChangedState" type="textarea" placeholder="请输入内容" />
        </el-form-item>
        <el-form-item label="图片列表" prop="mediaPicList">
          <el-input v-model="form.mediaPicList" type="textarea" placeholder="请输入内容" />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { listMedia, getMedia, delMedia, addMedia, updateMedia } from "@/api/gate/media";

export default {
  name: "Media",
  dicts: ['user_media_type', 'user_media_show_type'],
  data() {
    return {
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 媒体点位表格数据
      mediaList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        mediaNo: null,
        mediaName: null,
        mediaProvince: null,
        mediaCity: null,
        mediaCounty: null,
        mediaAddr: null,
        mediaType: null,
        mediaCommunityAddr: null,
        mediaLevel: null,
        mediaCommunityType: null,
        mediaHouseNum: null,
        mediaPersonNum: null,
        mediaRuzhuRate: null,
        mediaAudienceDetail: null,
        mediaFloorNum: null,
        mediaBuildingNum: null,
        mediaLiftsNum: null,
        mediaTaboo: null,
        mediaShowType: null,
        mediaBelonging: null,
        mediaSubBuilding: null,
        mediaSubHouse: null,
        mediaSubLifts: null,
        mediaSize: null,
        mediaPrice: null,
        mediaPriceTime: null,
        mediaPhoto: null,
        mediaBeginTime: null,
        mediaEndTime: null,
        mediaContacts: null,
        mediaPhone: null,
        mediaLng: null,
        mediaLat: null,
        mediaChangedState: null,
        mediaPicList: null
      },
      // 表单参数
      form: {},
      // 表单校验
      rules: {
        mediaNo: [
          { required: true, message: "点位编号不能为空", trigger: "blur" }
        ],
        mediaName: [
          { required: true, message: "点位名称不能为空", trigger: "blur" }
        ],
        mediaProvince: [
          { required: true, message: "省份不能为空", trigger: "blur" }
        ],
        mediaCity: [
          { required: true, message: "城市不能为空", trigger: "blur" }
        ],
        mediaCounty: [
          { required: true, message: "区县不能为空", trigger: "blur" }
        ],
        mediaAddr: [
          { required: true, message: "点位位置不能为空", trigger: "blur" }
        ],
        mediaType: [
          { required: true, message: "媒体性质 公交:1,城市路媒:2,楼宇:3,城市轨道交通:4,高速/国道:5,其他:6不能为空", trigger: "change" }
        ],
        mediaCommunityAddr: [
          { required: true, message: "详细地址不能为空", trigger: "blur" }
        ],
        mediaLevel: [
          { required: true, message: "社区级别不能为空", trigger: "blur" }
        ],
        mediaCommunityType: [
          { required: true, message: "社区分类不能为空", trigger: "change" }
        ],
        mediaHouseNum: [
          { required: true, message: "房屋数量不能为空", trigger: "blur" }
        ],
        mediaPersonNum: [
          { required: true, message: "人口数量不能为空", trigger: "blur" }
        ],
        mediaRuzhuRate: [
          { required: true, message: "入住率不能为空", trigger: "blur" }
        ],
        mediaAudienceDetail: [
          { required: true, message: "社区受众描述不能为空", trigger: "blur" }
        ],
        mediaFloorNum: [
          { required: true, message: "楼层数不能为空", trigger: "blur" }
        ],
        mediaBuildingNum: [
          { required: true, message: "楼栋数量不能为空", trigger: "blur" }
        ],
        mediaLiftsNum: [
          { required: true, message: "电梯数量不能为空", trigger: "blur" }
        ],
        mediaTaboo: [
          { required: true, message: "行业禁忌不能为空", trigger: "blur" }
        ],
        mediaShowType: [
          { required: true, message: "点位类型 道闸广告:1,电梯框架:2,广告看板:3,屏蔽门:4,候车亭广告:5,车身广告:6,其他:7不能为空", trigger: "change" }
        ],
        mediaBelonging: [
          { required: true, message: "点位所属 自有点位:0,租用:1,禁用:2不能为空", trigger: "blur" }
        ],
        mediaSubBuilding: [
          { required: true, message: "楼栋号不能为空", trigger: "blur" }
        ],
        mediaSubHouse: [
          { required: true, message: "单元号不能为空", trigger: "blur" }
        ],
        mediaSubLifts: [
          { required: true, message: "电梯号不能为空", trigger: "blur" }
        ],
        mediaSize: [
          { required: true, message: "尺寸不能为空", trigger: "blur" }
        ],
        mediaPrice: [
          { required: true, message: "价格不能为空", trigger: "blur" }
        ],
        mediaPriceTime: [
          { required: true, message: "价格时间 日:0,周:1,月:2,年:3不能为空", trigger: "blur" }
        ],
        mediaBeginTime: [
          { required: true, message: "开始时间不能为空", trigger: "blur" }
        ],
        mediaEndTime: [
          { required: true, message: "结束时间不能为空", trigger: "blur" }
        ],
        mediaContacts: [
          { required: true, message: "联系人不能为空", trigger: "blur" }
        ],
        mediaPhone: [
          { required: true, message: "电话不能为空", trigger: "blur" }
        ],
        mediaLng: [
          { required: true, message: "经度不能为空", trigger: "blur" }
        ],
        mediaLat: [
          { required: true, message: "纬度不能为空", trigger: "blur" }
        ],
      }
    };
  },
  created() {
    this.getList();
  },
  methods: {
    /** 查询媒体点位列表 */
    getList() {
      this.loading = true;
      listMedia(this.queryParams).then(response => {
        this.mediaList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        mediaId: null,
        mediaNo: null,
        mediaName: null,
        mediaProvince: null,
        mediaCity: null,
        mediaCounty: null,
        mediaAddr: null,
        mediaType: null,
        mediaCommunityAddr: null,
        mediaLevel: null,
        mediaCommunityType: null,
        mediaHouseNum: null,
        mediaPersonNum: null,
        mediaRuzhuRate: null,
        mediaAudienceDetail: null,
        mediaFloorNum: null,
        mediaBuildingNum: null,
        mediaLiftsNum: null,
        mediaTaboo: null,
        mediaShowType: null,
        mediaBelonging: null,
        mediaSubBuilding: null,
        mediaSubHouse: null,
        mediaSubLifts: null,
        mediaSize: null,
        mediaPrice: null,
        mediaPriceTime: null,
        mediaPhoto: null,
        mediaBeginTime: null,
        mediaEndTime: null,
        mediaContacts: null,
        mediaPhone: null,
        mediaLng: null,
        mediaLat: null,
        mediaChangedState: null,
        mediaPicList: null
      };
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.mediaId)
      this.single = selection.length!==1
      this.multiple = !selection.length
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      this.open = true;
      this.title = "添加媒体点位";
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      const mediaId = row.mediaId || this.ids
      getMedia(mediaId).then(response => {
        this.form = response.data;
        this.open = true;
        this.title = "修改媒体点位";
      });
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          if (this.form.mediaId != null) {
            updateMedia(this.form).then(response => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            addMedia(this.form).then(response => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const mediaIds = row.mediaId || this.ids;
      this.$modal.confirm('是否确认删除媒体点位编号为"' + mediaIds + '"的数据项？').then(function() {
        return delMedia(mediaIds);
      }).then(() => {
        this.getList();
        this.$modal.msgSuccess("删除成功");
      }).catch(() => {});
    },
    /** 导出按钮操作 */
    handleExport() {
      this.download('gate/media/export', {
        ...this.queryParams
      }, `media_${new Date().getTime()}.xlsx`)
    }
  }
};
</script>
